<template>
	<div class="project_experience">
		<div class="basic_data_jb" style="margin-bottom: 20px;">
			<img src="../../../../../static/img/res_img/jbzl.png" class="basic_data_img"/>
			<span class="span1">项目经验</span>
		</div>
		<div class="project_other">
			<p>项目经验是用人单位衡量人才能力的重要指标哦！</p>
			<p>来说说令你难忘的项目经历吧！</p>
		</div>
		<div id="project_info">
			<div class="project_info">
				<div class="education_right_res">
					项目业绩:<span>我</span>
				</div>
				<div class="education_right_res">
					项目职位:<span>我</span>
				</div>
				<div class="education_right_res">
					所在公司:<span>我</span>
				</div>
				<div class="education_right_res">
					项目描述:<span>我</span>
				</div>
				<div class="education_right_res">
					项目职责:<span>我</span>
				</div>
				<div class="education_right_res">
					项目业绩:<span>我</span>
				</div>
			</div>
		</div>
		
		<i-button type="primary" long  @click="AddWProject" v-show="project">+添加项目经验</i-button>
		
		<div  class="_addbasic_data"  v-show="addproject">
			<ul  class="add_work_education">
				<li>
					项目名称：</span>
					<i-input v-model="p_project" placeholder="请输入项目名称..." :maxlength="20" style="width: 86%"></i-input>
				</li>
				<li>
					<div class="work_experience1">
						<div class="work_experience11">
							公司名称：
						   <i-input v-model="p_company" placeholder="请输入公司名称..." :maxlength="20" style="width: 72%"></i-input>
						</div>
						<div class="work_experience11">
							项目职务：
							<i-input v-model="p_post" placeholder="请输入项目职务..." :maxlength="20" style="width: 72%"></i-input>
						</div>
					</div>
				</li>
				<li>
					项目时间：
					 <Row>
				        <Col span="12">
				            <DatePicker v-model="p_dataTime" :options="disabledDate" :maxlength="20"  @on-change="time1" type="daterange" 
				            	placement="bottom-end" placeholder="选择开始年份以及结束年份" style="width: 86%"></DatePicker>
				        </Col>
				    </Row>
				</li>
				<li>
					<div class="pro_li">
						<div>项目描述：</div>
						<div style="width: 86%;">
							<Input v-model="p_describe" type="textarea" :rows="4" placeholder="请详细描述项目内容，1000字内" :maxlength="1000" />
						</div>
					</div>
				</li>
				<li>
					<div class="pro_li">
						<div>项目职责：</div>
						<div style="width: 86%;">
							<Input v-model="p_duty" type="textarea" :rows="4" placeholder="请详细描述您的职责范围及工作任务，1000字内" :maxlength="1000"/>
						</div>
					</div>
				</li>
				<li>
					<div class="pro_li">
						<div>项目业绩：</div>
						<div style="width: 86%;">
							<Input v-model="p_achievement" type="textarea" :rows="4" placeholder="请详细描述您在项目中取得 业绩，1000字内" :maxlength="1000"/>
						</div>
					</div>
				</li>
			</ul>
			<div class="basic_data_foot">
				<i-button type="primary" style="width: 100px; margin-right: 50px;" @click="ProjectInfoSureClick">保存</i-button>
			    <i-button style="width: 100px;" @click="handleInfoCancelClick">取消</i-button>
		    </div>
		</div>
	</div>
</template>
<script>
	export default {
    	name: 'Project',
        data () {
            return {
            	project:true,
            	addproject:false,
            	
            	p_project:"",
            	p_company:"",
            	p_post:"",
            	p_dataTime:"",
            	p_describe:"",
            	p_duty:"",
            	p_achievement:""
            }
        },
        methods:{
        	AddWProject(){
        		this.project = false,
        		this.addproject = true
        	},
            handleInfoCancelClick(){
            	this.project = true,
        		this.addproject = false
            },
            time1(e){
            	console.log(e)
            },
            ProjectInfoSureClick(){
            	if(this.p_project ==""){
            		alert(66)
            	}else{
            		
            	}
        		this.project = false,
        		this.addproject = true
        	}
		}
    }
</script>
<style>
	.project_other{
		color: #999999;
		font-size: 12px;
		padding-left: 40px;
	}
	.pro_li{
		display: flex;
	}
	.education_right_res{
		font-size: 13px;
		margin-top: 5px;
		color: #999999;
	}
</style>
